<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <%@ include file="/static/web/jsp/include.jsp"%>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>艺术家</title>
    <meta name="description" content="网站描述" />
    <meta name="keywords" content="关键词" />
    <link rel="stylesheet" href="${path}/static/web/style/style.css">
    <link rel="stylesheet" href="${path}/static/web/style/art.css">
    <link rel="stylesheet" href="${path}/static/web/style/ICalendar.css">
    <script>
        var _keyword = '${keyword}';
    </script>
</head>
<body>
    <!-- 导航 -->
    <%@ include file="/static/web/jsp/top.jsp"%>

    <div id="artistController" v-cloak>
        <!-- 艺术家筛选 -->
        <div class="artist_filter model_container">
            <span class="name fl">艺术家筛选：</span>
            <a href="#" class="head_more news_more offer_artist_btn" @click="apply(true)" v-if="isArt != 1">申请艺术家</a>
            <div class="filter_letter">
                <a href="javascript:void(0);" :class="{'active':letter==''}" @click="selectLetter('')">全部</a>
                <a href="javascript:void(0);" v-for="item in letters" :class="{'active':letter==item}" @click="selectLetter(item)">{{item}}</a>
            </div>
        </div>

        <!-- 艺术家列表 -->
        <div class="artists_box container">
            <div class="artist_item" v-for="item in list">
                <div class="artist_side">
                    <a  :href="'${path}/web/artist/'+item.id"><img class="artist_avatar" src="${path}/static/web/images/author.png" v-sy-img="item.artImg"/></a>
                    <a class="artist_focus focus_on" href="javascript:void(0);" data-id='1' v-if="item.isFriend == 0" @click="focus(item)">关注</a>
                    <a class="artist_focus" href="javascript:void(0);" data-id='2' v-if="item.isFriend > 0" @click="focus(item)">已关注</a>
                </div>
                <div class="artist_aside">
                    <div class="artist_works">
                        <ul>
                            <li v-for="img in item.imgs"><img init-src="${path}/static/web/images/pro_slide01.png" v-sy-img="img"></li>
                        </ul>
                    </div>

                    <div class="artist_profile">
                        <h3 class="name">{{item.userName}}</h3>
                        <p class="profile">{{item.artInfo}}</p>
                        <a :href="'${path}/web/artist/'+item.id" class="about_more mt_20">更多作品</a>
                    </div>
                </div>
            </div>
        </div>

        <!-- 申请成为艺术家 -->
        <div class="art_model offer_model" :style="{'display':param.apply?'block':'none'}">
            <div class="model_wrap">
                <div class="model_header">
                    <div class="head_title">申请成为艺术家</div>
                    <a class="icon icon_close head_close" href="javascript:void(0);" @click="apply(false)"></a>
                </div>
                <div class="art_model_content">
                    <form action="">
                        <div class="model_avatar" @click="uploadImg">
                            <img init-src="${path}/static/web/images/artist_avatar.png" v-sy-img="info.artHeadImg" />
                        </div>
                        <div class="model_put"><input type="text" placeholder="请输入真实姓名" v-model="info.realName"/></div>
                        <div class="model_put"><input type="text" placeholder="请输入手机号码" v-model="info.artPhone"/></div>
                        <div class="model_put"><input type="text" placeholder="请输入常用邮箱" v-model="info.email"/></div>
                        <div class="model_put"><input type="text" placeholder="请输入个人履历" v-model="info.content"/></div>
                    </form>
                </div>
                <div class="model_btn mt_20" @click="applyArtist">
                    <a href="javascript:void(0);" class="btn btn_primary">确 定</a>
                </div>
            </div>
        </div>
    </div>

    <iframe name='hidden_frame' id="hidden_frame" style="display: none;"></iframe>
    <form action="${path}/fileUpload?callback=callback" id="form1" name="form1" encType="multipart/form-data" method="post" target="hidden_frame">
        <input type="file" id="img" accept="image/jpg, image/jpeg, image/png, image/gif" name="file" style="background: white;display: none;" />
    </form>
        
    <!-- 客服 -->
    <%@ include file="/static/web/jsp/footer.jsp"%>

</body>
<%--<script src="${path}/static/web/js/jquery.min.js"></script>--%>
<script src="${path}/static/web/js/slide.js"></script>
<script src="${path}/static/web/js/carousel.js"></script>
<script src="${path}/static/web/js/ICalendar.js"></script>

<script src="${path}/static/web/js/jquery.masonry.min.js"></script>
<script src="${path}/static/web/js/jQeasing.js"></script>

<script src="${path}/static/web/js/art.js"></script>
<script src="${path}/static/web/js/biz/artist.js"></script>
<script type="text/javascript">
    // 选择字母
    $('.filter_letter a').click(function(){
        $(this).addClass('active').siblings().removeClass('active');
    });

    

    </script>
    
</html>